<template>
  <div class="industry-map-right-list-wrapper">
    <div class="top-img-wrapper">
      <img class="" src="@/assets/img/ybq.png" />
      <div class="img-title">
        {{ areaName }}
      </div>
    </div>

    <MapRightListPark />
  </div>
</template>

<script lang="ts">
import Vue from 'vue'
import { mapGetters } from 'vuex'
import MapRightListPark from '@/components/index/industryMap/MapRightListPark'
export default Vue.extend({
  components: { MapRightListPark },
  data() {
    return {}
  },
  computed: {
    ...mapGetters('industryMap', ['areaName', 'parkName']),
  },
  mounted() {},
})
</script>
<style lang="scss" scoped>
.industry-map-right-list-wrapper {
  padding: 0 20px;
  height: 100%;
  .top-img-wrapper {
    margin-bottom: 20px;
    height: 188px;
    position: relative;
    .img-title {
      font-size: 20px;
      font-weight: bold;
      color: #fff;
      position: absolute;
      top: 15px;
      left: 15px;
    }
  }
}
</style>
